<template>
    <div class=''>
      <ul class="navigation" router>
       <router-view>
         <li @click="router.push('/page')">首页</li>
        <li @click="router.push('/jkbk')">健康百科</li>
        <li @click="router.push('/wachat')">消息通知</li>
        <li @click="router.push('/my')">我的</li>
       </router-view>
      </ul>
    </div>
</template>

<script lang="ts" setup>
import { ref, reactive, toRefs } from 'vue';
 import { useRouter, useRoute } from 'vue-router';
const router = useRouter();
const route = useRoute();
const data = reactive({});
</script>

<style>
.navigation{
  width: 100%;
  height: 60px;
  text-align: center;
  line-height: 60px;
  display: flex;
  justify-content: space-between;
  position: fixed;
  bottom: 0;
  left: 0;
}

</style>
